import { pushWatcher, popWatcher } from "./dep";
import { queryWatcher } from "../schedular";

// 每个watcher的id,保证每个watcher的唯一性
let id = 0;

export default class Watcher {
	constructor(vm, exprOrFn, callback, options) {
		this.vm = vm;
		// 内部传来的更新页面的方法挂载到getter上
		this.getter = exprOrFn;
		this.callback = callback;
		this.options = options;
		this.id = id++;
		this.depId = new Set(); // 保存对应的deps,不能重复
		// 一个watcher对应对应多个dep
		this.deps = [];
		// 调用get方法会重新渲染视图
		this.get();
	}
	get() {
		// 把当前watcher存起来(收集依赖)
		pushWatcher(this);
		// 更新视图
		this.getter();
		// 更新完页面后销毁当前watcher
		popWatcher();
	}
	// 更新视图
	update() {
		// 值改变异步更新页面,多个值改变,一次性渲染
		queryWatcher(this);
	}
	// 记住对应的依赖
	addDep(dep) {
		const { id } = dep;
		// 保存没保存过的依赖
		if (!this.depId.has(id)) {
			this.depId.add(id);
			// 保存多个依赖
			this.deps.push(dep);
			// 对应的依赖也保存对应的watcher,多对多关系
			dep.addSub(this);
		}
	}
	run() {
		// 调用get方法来更新视图
		this.get();
	}
}
